class Observer {
  constructor(value) {
    // 数据可能是数组
    this.walk(value)
    console.log('data',value )
  }
  // 为了拿到对象或者数组
  walk(data) {
    let keys = Object.keys(data);
    // 获取最外层的数据
    keys.forEach(key=>{
      // vue源码中util中有对应的方法,将属性对应到数据上
      defineReactive(data,key,data[key]);
    })
    // 
  }
}

function defineReactive(data,key,value) {
  // 数据劫持(递归思想，性能比较差)--vue3.0使用了proxy
  // observer(value)
  Object.defineProperty(data,key,{
    get() {
      console.log('用户获取值')
      return value
    },
    set(newValue) {
      console.log('用户设置值')
      if(newValue == value) return 
      observer(value)
      value = newValue
    }
  })
}

export function observer(data) {
  // 这里的数据不能不是对象，但是不能是null
  if(typeof data !== 'object' && data !== null){
    return
  }
  return new Observer(data)
  console.log('123', data)
}